<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>鼠标修饰符</title>
<!--引入Vue库-->
<script src="vue.js"></script>
</head>
<body>	
<div id="app">
  <button @mouseup.right="right" @mouseup.middle="middle" 
		  @mouseup.left="left">{{ message }}</button>
</div>
<script>
var vm = new Vue({
    el: '#app',
    data:{
      message:'提示信息：分别用左、中、右键进行单击，按钮名称会同步发生变化'
    },
    methods:{
      left(){
        this.message = 'left'
      },
      right(){
        this.message = 'right'
      },
      middle(){
        this.message = 'middle'
      },        
    }
  })
</script>
</body>
</html>
